import { Slot, component$ } from '@builder.io/qwik';
import { type RequestHandler, useNavigate } from '@builder.io/qwik-city';
import { noCache } from '~/server/cache-control';
import { QMyPostCollections } from '~/integrations/react/my-post-collections';
import { findMyCollections, createCollection, updateCollection } from './server';

export const onGet: RequestHandler = async (ev) => {
  noCache(ev);
};

export default component$(() => {
  const navigate = useNavigate();

  return (
    <div>
      <div class="flex gap-2">
        <div style={{ width: 300 }}>
          <QMyPostCollections
            client:visible
            onNavigate$={navigate}
            onCreate$={createCollection}
            onUpdate$={updateCollection}
            onLoadAll$={async () => {
              try {
                const collections = await findMyCollections();
                return { ok: true, data: collections };
              } catch (e) {
                return { ok: false, error: (e as Error).message || '未知错误' };
              }
            }}
          />
        </div>
        <div class="flex-1">
          <Slot />
        </div>
      </div>
    </div>
  );
});
